<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<%@ include file="/WEB-INF/jsp/include/taglibs.jsp"%>
<%@ page import="com.goodedeeds.webapp.controller.MyProfileAction" %>
<%--@elvariable id="actionBean" type="com.depo.quiggle.view.controller.MyProfileAction"--%>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.maskedinput.js"></script>
<div class="help"><a href="#" id="helpButton"><img src="images/helpicon.png"  alt="Help" width="36" height="94" border="0" /></a></div>

<div class="infoBut" style="top:250px;"><a href="#" id="infoButton"><img id="helpIMG" src="images/infoicon.png"  alt="Information" border="0" /></a></div>
<stripes:form id="my-profile-form" action="<%=MyProfileAction.URL%>">
<input type="hidden" name="changeInd" id="changeInd" value="false"/>
		<!-- DISPLAY SUCCESS MESSAGE AFTER SAVE START-->
		
			<%
			if (request.getParameter("savedMessage") != null) {
			%><div class="alert alert-success" id="successDiv"><b>Your Information Saved Successfully</b><button class="close" type="button">×</button></div><%
			}
			%>
			
		<!-- DISPLAY SUCCESS MESSAGE AFTER SAVE START--> 
<!-- Begin Instruction -->
 <div class="instructions" style="width:97%;">
            <h3><span class="fright" id="instrutionsSpan">
					<a href="javascript:{}" title="click here to hide the instructions" id="instructionsHideLink" style="background:#E3F2FF;">
						<img  id="instructionsDownarrowimg" src="images/uparrow.png" width="10" height="9" alt="Hide" />
					</a>
				</span>PROFILE</h3>
            	<div id="contentIns"><strong>Create your user profile</strong>
<OL>
  <li>Your data input determines the QGL calculations</li>
<li>Your address appears on invoices</li>
<li>Your information and availability can be shared with others (or not)</li>
</OL>

<p><strong>Keyboard Shortcuts/Tips </strong><br />
<strong>Tab</strong> through to minimize use of the mouse.<br />
<strong>Shift + Tab</strong> to go back .<br />
<strong>Hold Shift+up/down Arrows</strong>,Tab and click Space Bar to choose Multiple items in Data Field<br />
Toggle between public/private by clicking the <strong>space bar</strong>.<br />
Hover mouse over ? for tooltips.<br />
Click <strong>HELP?</strong> tab to the right  to get help in setting up your profile.<br />
Click <strong>INSTRUCTIONS</strong> tab to the right for further instructions.<br />
</p>
</div>
</div>
            
      
<!-- End Instruction -->
<fmt:setBundle basename="help" var="help" />
<div class="profile-content dashboard-content" id="profile-edit" style="width:97%;">
<!-- Top Row Buttons -->
<div class="profile-buttons top-row-buttons">

	<div class="f-l p-5">
        <stripes:button class="button t-tip unload sendProfile" id="accountreceivableProfiles"  name="Send PROFILE" value="Send Profile" title="Send your public profile to account receivable" />
        <div class="button-end"></div>
    </div>

    <div class="f-l p-5">

        <stripes:submit class="button t-tip unload" name="preview" value="Preview" title="Preview public profile" />
        <div class="button-end"></div>
    </div>
    <div class="f-l p-5">
        <stripes:submit class="button t-tip unload" name="save" value="Save" title="Save"/>
        <div class="button-end"></div>
    </div>
    <div class="f-l p-5">
        <stripes:button id="cancelId" class="button t-tip cancel" name="cancel" value="Cancel" title="Cancel"/>
        <div class="button-end"></div>

		 <div id="showconfirmDiv">
           <div id="showDiv"></div>
     </div>
    </div>
    
    <div class="clear"></div>
</div>
<!-- Top row buttons -->
<div class="h1">User Profile</div>
<div id="ui-tips">
<c:if test="${actionBean.showPreview}">
    <div class="profile-content dashboard-content" id="profile-preview">
        <jsp:include page="${actionBean.publicProfilePage}"/>
    </div>
</c:if>
</div>

<div id="save-or-discard"></div>
<div class="profile-left-container">
	<div class="profile-block">
	    <div class="f-l p-5">
	        <stripes:label for="firstName">First Name</stripes:label>
	        <stripes:text maxlength="49" class="mandatoryfield t-tip" id="firstName" name="userProfile.firstName"  title="Enter First Name" />
	    </div>
	    <div class="f-l p-5">
	        <stripes:label for="middleName">Middle Name</stripes:label>
	        <stripes:text maxlength="49" id="middleName" name="userProfile.middleName" class="t-tip" title="Enter Your Middle Name" />
	    </div>
	    <div class="f-l p-5">
	        <stripes:label for="lastName">Last Name</stripes:label>
	        <stripes:text maxlength="49" id="lastName" name="userProfile.lastName" class="mandatoryfield t-tip" title="Enter your Last Name"/>
	    </div>
		<div class="f-l p-5">
	        <stripes:label for="initials">Initials</stripes:label>
	        <stripes:text maxlength="10" id="initials" name="userProfile.initials" class="mandatoryfield t-tip"  title="Enter your initials or shortened name only"/>
	    </div>
	    <div class="f-l p-5">
	        <div class="public-private-switch" tabindex="0">
	            <stripes:hidden class="p-p-input" id="profilePublic" name="userProfile.public"/>
	            <c:choose>
	                <c:when test="${actionBean.userProfile.public}">
	                    <span class="public-private-button public tip t-tip" title="<fmt:message bundle='${help}' key='help.profile.PUBLIC' />">Public</span>
	                </c:when>
	                <c:otherwise>
	                    <span class="public-private-button tip t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
	                </c:otherwise>
	            </c:choose>
	        </div>
	    </div>
	    <div class="clear"></div>
	</div>
<c:set var="cIndex" value="0" scope="page" />
<c:forEach items="${actionBean.userProfile.contacts}" var="contact" varStatus="cLoop">
<c:set var="cIndex" value="${cLoop.index + 1}"/>    
</c:forEach>


<%-- Contacts - START --%>

<c:forEach items="${actionBean.userProfile.contacts}" var="contact" varStatus="cLoop">
<c:if test="${contact.contactType==1 || contact.contactType==3 || contact.contactType==4 || contact.contactType==5 || contact.contactType==6 || contact.contactType==7}">
    <div id="phoneTemplate-${cLoop.index}" class="profile-block">
        <stripes:hidden	name="userProfile.contacts[${cLoop.index}].contactId"/>
        <stripes:hidden name="userProfile.contacts[${cLoop.index}].userId"/>
            <%--<stripes:hidden	name="userProfile.contacts[${cLoop.index}].contactId" value="${contact.contactId}" />--%>
            <%--<stripes:hidden name="userProfile.contacts[${cLoop.index}].userId" value="${contact.userId}" />--%>

        <div class="f-l p-5">
                <%--<label for="contactType[${cLoop.index}]">Contact Type</label>--%>
                <stripes:select class="phoneSelect t-tip" id="contactType[${cLoop.index}]" name="userProfile.contacts[${cLoop.index}].contactType" title="Select primary phone - indicate home, cell, business">
	                <stripes:options-collection collection="${actionBean.contactTypes}" label="name" value="contactType"/>
	            </stripes:select>
        </div>
        <div class="f-l p-5">
                <%--<label for="contactValue[${cLoop.index}]">Contact Value</label>--%>
            <stripes:text maxlength="99" id="contactValue[${cLoop.index}]" name="userProfile.contacts[${cLoop.index}].contactValue"  title="Enter primary phone - indicate home, cell, business" class="t-tip phoneval"/>
        </div>
        
        <div class="f-l p-5">
            <div class="public-private-switch" tabindex="0">
                <stripes:hidden class="p-p-input" name="userProfile.contacts[${cLoop.index}].public"/>
                <c:choose>
                    <c:when test="${contact.public}">
	                    <span class="public-private-button public  t-tip" title="<fmt:message bundle='${help}' key='help.profile.PUBLIC' />">Public</span>
                    </c:when>
                    <c:otherwise>
						<span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
                    </c:otherwise>
                </c:choose>

            </div>
        </div>
        <div class="f-l p-5">
            <div class="p-0">
                <stripes:hidden class="delete-input" name="userProfile.contacts[${cLoop.index}].deleted"/>
                <span class="delete-button p-button p-5" template="phoneTemplate-${cLoop.index}">Delete</span>
            </div>
        </div>
        <div class="clear"></div>
    </div>
 </c:if>
</c:forEach>
<div id="phone-placeholder" class="hidden clear"></div>

<div class="profile-block">
    <div class="clear">
        <span id="addPhone" class="p-5 add-button p-button">Add Phone</span>
		<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.ADD_PHONE' />" id="toolTipImage"></span>
    </div>
</div>

<c:forEach items="${actionBean.userProfile.contacts}" var="contact" varStatus="cLoop">
	<c:if test="${contact.contactType==2 || contact.contactType==8}"> 	
    <div id="emailTemplate-${cLoop.index}" class="profile-block">
        <stripes:hidden	name="userProfile.contacts[${cLoop.index}].contactId"/>
        <stripes:hidden name="userProfile.contacts[${cLoop.index}].userId"/>
            <%--<stripes:hidden	name="userProfile.contacts[${cLoop.index}].contactId" value="${contact.contactId}" />--%>
            <%--<stripes:hidden name="userProfile.contacts[${cLoop.index}].userId" value="${contact.userId}" />--%>
      
      
        <div class="f-l p-5">
                <%--<label for="contactType[${cLoop.index}]">Contact Type</label>--%>
                  	<stripes:select class="emailSelect t-tip" id="contactType[${cLoop.index}]" name="userProfile.contacts[${cLoop.index}].contactType" title="Select e-mail Type">
                		<stripes:options-collection collection="${actionBean.contactTypes}" label="name" value="contactType"/>
            		</stripes:select>             
              
        </div>
        <div class="f-l p-5">
                <%--<label for="contactValue[${cLoop.index}]">Contact Value</label>--%>
            <stripes:text maxlength="99" id="contactValue[${cLoop.index}]" name="userProfile.contacts[${cLoop.index}].contactValue" class="emailval t-tip" title="Enter primary e-mail"/>
        </div>
     
        <div class="f-l p-5">
            <div class="public-private-switch" tabindex="0">
                <stripes:hidden class="p-p-input" name="userProfile.contacts[${cLoop.index}].public"/>
                <c:choose>
                    <c:when test="${contact.public}">
	                    <span class="public-private-button public t-tip" title="<fmt:message bundle='${help}' key='help.profile.PUBLIC' />">Public</span>
                    </c:when>
                    <c:otherwise>
						<span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
                    </c:otherwise>
                </c:choose>

            </div>
        </div>
        <div class="f-l p-5">
            <div class="p-0">
                <stripes:hidden class="delete-input" name="userProfile.contacts[${cLoop.index}].deleted"/>
                <span class="delete-button p-button p-5" template="emailTemplate-${cLoop.index}">Delete</span>
            </div>
        </div>
        <div class="clear"></div>
    </div>
    </c:if>
</c:forEach>
<div id="email-placeholder" class="hidden clear"></div>
<div class="profile-block">
    <div class="clear">
        <span id="addEmail" class="p-5 add-button p-button" >Add Email</span>
		<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.ADD_EMAIL' />" id="toolTipImage"></span>
    </div>
</div>
<%-- Contacts - END --%>

<div class="h3">Address<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.ADDRESS' />" id="toolTipImage"></span></div>
		<c:set var="aIndex" value="0" scope="page" />
		<c:forEach items="${actionBean.userProfile.addresses}" var="address" varStatus="aLoop">
    	<div id="addressTemplate-${aLoop.index}" class="profile-block">
        <stripes:hidden
                name="userProfile.addresses[${aLoop.index}].addressId"
                value="${address.addressId}" />
        <stripes:hidden name="userProfile.addresses[${aLoop.index}].userId"
                        value="${address.userId}" />

        <div class="f-l p-5 addressarea">
            <label for="address1[${aLoop.index}]">Address1</label>
            <stripes:text maxlength="49" class="t-tip" id="address1[${aLoop.index}]" name="userProfile.addresses[${aLoop.index}].address1" title="Number and Street Name"/>
        </div>
        <div class="f-l p-5 addressarea">
            <label for="address2[${aLoop.index}]">Address2</label>
            <stripes:text maxlength="49" class="t-tip" id="address2[${aLoop.index}]" name="userProfile.addresses[${aLoop.index}].address2" title="Apartment, Unit or Suite Number, if applicable"/>
        </div>
        <div  class="f-l p-5">
            <label for="city[${aLoop.index}]">City</label>
            <stripes:text maxlength="49" class="t-tip" id="city[${aLoop.index}]" name="userProfile.addresses[${aLoop.index}].city" title="City"/>
        </div>
            <%--<div class="clear"></div>--%>
        <div  class="f-l p-5">
            <label for="state[${aLoop.index}]">State</label>
           <!-- <stripes:select id="state[${aLoop.index}]" name="userProfile.addresses[${aLoop.index}].state" title="State" class="t-tip">
                <option value="">State</option>
                <stripes:options-collection collection="${actionBean.usaStates}" value="shortName" label="shortName"/>
            </stripes:select> --> 
            
         <stripes:text maxlength="45"  class="usaStates t-tip" id="state[${aLoop.index}]" name="userProfile.addresses[${aLoop.index}].state" title="State"/>
            
        </div>
        <div  class="f-l p-5">
            <label for="zip[${aLoop.index}]">ZIP</label>
            <stripes:text maxlength="10" id="zip[${aLoop.index}]" name="userProfile.addresses[${aLoop.index}].zip" title="ZIP" class="t-tip zipval"/>
        </div>
        <!--<div  class="f-l p-5 primary-email">
            <label for="primayEmail[${aLoop.index}]">primaryEmail</label>
            <stripes:text id="primayEmail[${aLoop.index}]" name="userProfile.addresses[${aLoop.index}].primaryEmail"/>
        </div>
        <div  class="f-l p-5 primary-phone">
            <label for="primaryPhoneNumber[${aLoop.index}]">primaryPhoneNumber</label>
            <stripes:text id="primaryPhoneNumber[${aLoop.index}]" name="userProfile.addresses[${aLoop.index}].primaryPhoneNumber"/>
        </div>
        <div  class="f-l p-5 secondary-email">
            <label for="secondaryEmail[${aLoop.index}]">secondaryEmail</label>
            <stripes:text id="secondaryEmail[${aLoop.index}]" name="userProfile.addresses[${aLoop.index}].secondaryEmail"/>
        </div>
        <div  class="f-l p-5 secondary-phone">
            <label for="secondaryPhoneNumber[${aLoop.index}]">secondaryPhoneNumber</label>
            <stripes:text id="secondaryPhoneNumber[${aLoop.index}]" name="userProfile.addresses[${aLoop.index}].secondaryPhoneNumber"/>
        </div>-->
		 <div  class="f-l p-5">
            <label for="timeZone[${aLoop.index}]">Time Zone</label>
            <!--<stripes:text class="timeZone t-tip" id="timeZone[${aLoop.index}]" name="userProfile.addresses[${aLoop.index}].timeZone" title="Select for this address"/>-->
            <stripes:select class="timeZone t-tip" id="timeZone[${aLoop.index}]" name="userProfile.addresses[${aLoop.index}].timeZone" title="Select for this address">
                <stripes:options-collection collection="${actionBean.timeZones}" label="timeZoneValue" value="timeZoneId"/>
            </stripes:select>
         </div>
        <div class="f-l p-5">
            <div class="public-private-switch" tabindex="0">
                <stripes:hidden class="p-p-input" name="userProfile.addresses[${aLoop.index}].public"/>
                <c:choose>
                    <c:when test="${address.public}">
	                    <span class="public-private-button public t-tip" title="<fmt:message bundle='${help}' key='help.profile.PUBLIC' />">Public</span>
                    </c:when>
                    <c:otherwise>
						<span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
                    </c:otherwise>
                </c:choose>

            </div>
        </div>
        <div class="f-l p-5">
            <div class="p-0">
                <stripes:hidden class="delete-input" name="userProfile.addresses[${aLoop.index}].deleted"/>
                <span class="delete-button p-button p-5" template="addressTemplate-${aLoop.index}">Delete</span>
            </div>
        </div>
        <div class="clear"></div>
    </div>

    <c:set var="aIndex" value="${aLoop.index + 1}" scope="page" />
</c:forEach>
<div id="address-placeholder" class="hidden"></div>
<div class="profile-block">
        <%--<div class="clear"></div>--%>
    <div>
        <span id="addAddress" class="p-5 add-button p-button"> Add Address</span><span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.Add_Address' />" id="toolTipImage"></span>
    </div>

</div>

<div class="h3">Emergency Contact<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.EMERGENCY_CONTACT' />" id="toolTipImage"></span></div>

    <%-- Emergency Contacts - START --%>
<c:set var="ecIndex" value="0" scope="page" />
<c:forEach items="${actionBean.userProfile.emergencyContacts}" var="emergencyContact" varStatus="cLoop">
    <div id="emergencyContactTemplate-${cLoop.index}" class="profile-block emergencycontact">
        <stripes:hidden	name="userProfile.emergencyContacts[${cLoop.index}].emergencyContactId"/>
        <stripes:hidden name="userProfile.emergencyContacts[${cLoop.index}].userId"/>
            <%--<stripes:hidden	name="userProfile.contacts[${cLoop.index}].contactId" value="${contact.contactId}" />--%>
            <%--<stripes:hidden name="userProfile.contacts[${cLoop.index}].userId" value="${contact.userId}" />--%>
        <div class="f-l p-5">
                <label for="emergencyContactType[${cLoop.index}]">Emergency Contact Type</label>
            <stripes:select class="t-tip" id="emergencyContactType[${cLoop.index}]" name="userProfile.emergencyContacts[${cLoop.index}].emergencyContactType" title="Select one">
                <stripes:options-collection collection="${actionBean.emergencyContactTypes}" label="name" value="emergencyContactTypeId"/>
            </stripes:select>
        </div>
        <div class="f-l p-5">
                <label for="emergencyContactName[${cLoop.index}]">Name</label>
            <stripes:text maxlength="99" class="t-tip" id="emergencyContactName[${cLoop.index}]" name="userProfile.emergencyContacts[${cLoop.index}].name" title=" First and Last Name"/>
        </div>
        <div class="f-l p-5 errphonemsg">
                <label for="emergencyContactPhone[${cLoop.index}]">Phone</label>
            <stripes:text maxlength="99" class="t-tip phoneval" id="emergencyContactPhone[${cLoop.index}]" name="userProfile.emergencyContacts[${cLoop.index}].phone" title="Enter phone number"/>
        </div>
        <div class="f-l p-5">
                <label for="emergencyContactEmail[${cLoop.index}]">Email</label>
            <stripes:text maxlength="99" id="emergencyContactEmail[${cLoop.index}]" name="userProfile.emergencyContacts[${cLoop.index}].email" title="Enter email" class="t-tip emailval"/>
        </div>
        <div class="f-l p-5">
            <div class="public-private-switch" tabindex="0">
                <stripes:hidden class="p-p-input" name="userProfile.emergencyContacts[${cLoop.index}].public"/>
                <c:choose>
                    <c:when test="${emergencyContact.public}">
						<span class="public-private-button public t-tip" title="<fmt:message bundle='${help}' key='help.profile.PUBLIC' />">Public</span>
                    </c:when>
                    <c:otherwise>
						<span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
                    </c:otherwise>
                </c:choose>

            </div>
        </div>
        <div class="f-l p-5">
            <div class="p-0">
                <stripes:hidden class="delete-input" name="userProfile.emergencyContacts[${cLoop.index}].deleted"/>
                <span class="delete-button p-button p-5" template="emergencyContactTemplate-${cLoop.index}">Delete</span>
            </div>
        </div>
        <div class="clear"></div>
    </div>
    <c:set var="ecIndex" value="${cLoop.index + 1}"/>
</c:forEach>

<div id="emergency-contact-placeholder" class="hidden clear"></div>

<div class="profile-block">
    <div class="clear">
        <span id="addEmergencyContact" class="p-5 add-button p-button">Add Emergency Contact</span>
    </div>
</div>

    <%-- Emergency Contacts - END --%>
    
<div class="h3">Certification<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.CERTIFICATION' />" id="toolTipImage"></span></div>

    <%--Certificate - START--%>
<c:set var="certIndex" value="0" scope="page" />
<c:forEach items="${actionBean.userProfile.certificates}" var="cert" varStatus="certLoop">
    <div id="certTemplate-${certLoop.index}" class="profile-block">
        <stripes:hidden	name="userProfile.certificates[${certLoop.index}].certificateId"/>
        <stripes:hidden name="userProfile.certificates[${certLoop.index}].userId"/>

            <%--
                    <div class="f-l p-5">
                        <stripes:label name="userProfile.certificates[${certLoop.index}].public">Is Certificate Public</stripes:label>
                        <stripes:checkbox class="inputs" name="userProfile.certificates[${certLoop.index}].public"/>
                    </div>
            --%>
        <div class="f-l p-5">
            <label for="certificateType[${certLoop.index}]">Certificate Type</label>
            <stripes:select id="certificateType[${certLoop.index}]" name="userProfile.certificates[${certLoop.index}].certificateType" class="certificateType t-tip" title="Choose or add certification or degree">
                <stripes:options-collection collection="${actionBean.certificateTypes}" label="certificateTypeName" value="certificateTypeId"/>
            </stripes:select>
        </div>
		<div class="f-l p-5 hiddenTextBox">
           <span class="toolTip-cust">
			<span class="toolTip-caption" style="display: none;">Enter Other Certificate Type</span>
            <stripes:text maxlength="99" id="certificateTypeOther[${certLoop.index}]" name="userProfile.certificates[${certLoop.index}].certificateTypeOther" class="certificateTypeOther t-tip" title="Enter Other Certificate Type"/>
			</span>
        </div>
        <div class="f-l p-5">
            <label for="certificateCateg[${certLoop.index}]">Level</label>
            <stripes:select id="certificateCateg[${certLoop.index}]" name="userProfile.certificates[${certLoop.index}].certifCategType" class="certificateLevel t-tip" title="Select one">
                <stripes:options-collection collection="${actionBean.certifCategTypes}" label="name" value="certifCategTypeId"/>
            </stripes:select>
        </div>
        <div class="f-l p-5">
            <label for="certificateCategVal[${certLoop.index}]"></label>
            <stripes:text maxlength="49" class="autoCert t-tip" id="certificateCategVal[${certLoop.index}]" name="userProfile.certificates[${certLoop.index}].certificateState" title="Enter State or Country"/>
        </div>

		
        <div class="f-l p-5">
            <label for="issuingBody[${certLoop.index}]">Issuing Body</label>
            <stripes:text maxlength="99" id="issuingBody[${certLoop.index}]" name="userProfile.certificates[${certLoop.index}].issuingBody" title="Certification or degree from name of issuer " class="t-tip"/>
        </div>
     <!--     <div class="f-l p-5">
            <label for="certificateState[${certLoop.index}]">State</label>
            <stripes:select id="certificateState[${certLoop.index}]" name="userProfile.certificates[${certLoop.index}].certificateState">
                <option value="">State</option>
                <stripes:options-collection collection="${actionBean.usaStates}" value="shortName" label="fullName"/>
            </stripes:select>
        </div> -->
        <div class="f-l p-5">
            <label for="certificateNumber[${certLoop.index}]">Certificate Number/Year</label>
            <stripes:text maxlength="99" title="Enter certification number or year received or both" class="t-tip" id="certificateNumber[${certLoop.index}]" name="userProfile.certificates[${certLoop.index}].certificateNumber" />
        </div>

        <div class="f-l p-5">
            <div class="public-private-switch" tabindex="0">
                <stripes:hidden class="p-p-input" name="userProfile.certificates[${certLoop.index}].public"/>
                <c:choose>
                    <c:when test="${cert.public}">
	                    <span class="public-private-button public t-tip" title="<fmt:message bundle='${help}' key='help.profile.PUBLIC' />">Public</span>
                    </c:when>
                    <c:otherwise>
						<span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
                    </c:otherwise>
                </c:choose>
            </div>
        </div>
        <div class="f-l p-5">
            <div class="p-0">
                <stripes:hidden class="delete-input" name="userProfile.certificates[${certLoop.index}].deleted"/>
                <span class="delete-button p-button p-5" template="certTemplate-${certLoop.index}">Delete</span>
            </div>
        </div>
        <div class="clear"></div>
    </div>
    <c:set var="certIndex" value="${certLoop.index + 1}"/>
</c:forEach>

<div id="cert-placeholder" class="hidden clear"></div>

<div class="profile-block">
    <div class="clear">
        <span id="addCert" class="p-5 add-button p-button">Add Certificate</span>
    </div>
</div>

    <%-- Certificates- END --%>

 <div class="h3">Education<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.EDUCATION' />" id="toolTipImage"></span></div>

<div class="profile-block">
    <div class="p-5">
        <table>
            <tr>
                <td>
                    <select name="rptgSchoolsAvailable" id="schools-left" size="8" multiple="multiple" title="Choose or add school(s) attended" class="t-tip" style="width:326px;">
                        <c:forEach items="${actionBean.rptgSchools}" var="rptgSchool">
                            <option value="${rptgSchool.selectionId}">${rptgSchool.selectionName}</option>
                        </c:forEach>
                    </select>
                </td>
<br/><br/>
                <td class="low" rowspan="2">
                    <input class="p-button" name="schools-left2schools-right" value="&nbsp;&nbsp;&nbsp;&nbsp;add >>&nbsp;&nbsp;" type="button"><br/><br/>
                    <input class="p-button" name="schools-right2schools-left" value="<< remove" type="button">
                </td>

                <td rowspan="2">
                    <select class="multi-select-right" name="userProfile.rptgSchoolIds" id="schools-right" size="10" multiple="multiple" style="width:326px;">
                        <c:forEach items="${actionBean.userProfile.rptgSchools}" var="userRptgSchool">
                            <c:choose>
                                <c:when test="${userRptgSchool.customSelection}">
                                    <option value="${userRptgSchool.selectionValue}">${userRptgSchool.selectionValue}</option>
                                </c:when>
                                <c:otherwise>
                                    <option value="${userRptgSchool.selectionId}">${userRptgSchool.selectionValue}</option>
                                </c:otherwise>
                            </c:choose>
                        </c:forEach>
                    </select>
                </td>
                <td rowspan="2">
                    <div class="public-private-switch" tabindex="0">
                        <stripes:hidden class="p-p-input" name="userProfile.rptgSchoolPublic"/>
                        <c:choose>
                            <c:when test="${actionBean.userProfile.rptgSchoolPublic}">
	                    		<span class="public-private-button public t-tip" title="<fmt:message bundle='${help}' key='help.profile.PUBLIC' />">Public</span>
                            </c:when>
                            <c:otherwise>
								<span class="public-private-button  t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
                            </c:otherwise>
                        </c:choose>

                    </div>

                </td>
            </tr>
            <tr>
                <td>
                    <input type="text" class="multi-select-add-text t-tip" title="<fmt:message bundle='${help}' key='help.profile.CAT_SOFTWARE_ADD' />">
                    <span class="p-button p-5" id="school-add" title="<fmt:message bundle='${help}' key='help.profile.EDUCATION_ADD' />">Add &gt;&gt;</span>
                </td>
            </tr>
        </table>
    </div>
</div>



<div class="h3">CAT Software<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.CAT_SOFTWARE' />" id="toolTipImage"></span></div>

<div class="profile-block">
    <div class="p-5">
        <table>
            <tr>
                <td>
                    <select class="t-tip" title="Choose all that apply or add" name="catSoftwaresAvailable" id="cats-left" size="8" multiple="multiple">
                        <c:forEach items="${actionBean.catSoftwares}" var="catSoftware">
                            <option value="${catSoftware.selectionId}">${catSoftware.selectionName}</option>
                        </c:forEach>
                    </select>
                </td>

                <td class="low" rowspan="2">
                    <input class="p-button" name="cats-left2cats-right" value="&nbsp;&nbsp;&nbsp;&nbsp;add >>&nbsp;&nbsp;&nbsp;" type="button"><br/><br/>
                    <input class="p-button" name="cats-right2cats-left" value="<< remove" type="button">
                </td>

                <td rowspan="2">
                    <select class="multi-select-right" name="userProfile.catSoftwareIds" id="cats-right" size="10" multiple="multiple">
                        <c:forEach items="${actionBean.userProfile.catSoftwares}" var="userCatSoftware">
                            <c:choose>
                                <c:when test="${userCatSoftware.customSelection}">
                                    <option value="${userCatSoftware.selectionValue}">${userCatSoftware.selectionValue}</option>
                                </c:when>
                                <c:otherwise>
                                    <option value="${userCatSoftware.selectionId}">${userCatSoftware.selectionValue}</option>
                                </c:otherwise>
                            </c:choose>
                        </c:forEach>
                    </select>
                </td>
                <td rowspan="2">
                    <div class="public-private-switch" tabindex="0">
                        <stripes:hidden class="p-p-input" name="userProfile.catSoftwarePublic"/>
                        <c:choose>
                            <c:when test="${actionBean.userProfile.catSoftwarePublic}">
	                    		<span class="public-private-button public t-tip" title="<fmt:message bundle='${help}' key='help.profile.PUBLIC' />">Public</span>
                            </c:when>
                            <c:otherwise>
								<span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
                            </c:otherwise>
                        </c:choose>

                    </div>

                </td>
            </tr>
            <tr>
                <td>
                    <input type="text" class="multi-select-add-text t-tip" title="<fmt:message bundle='${help}' key='help.profile.CAT_SOFTWARE_ADD' />">
                    <span class="p-button p-5" id="cat-add" title="<fmt:message bundle='${help}' key='help.profile.CAT_SOFTWARE_ADD' />">Add &gt;&gt;</span>
                </td>
            </tr>
        </table>
    </div>
</div>


<div class="h3 p-5">Computer Operating Systems<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.COMPUTER_OPERATING_SYSTEM' />" id="toolTipImage"></span></div>

<div class="profile-block">
    <div class="p-5">
        <table>
            <tr>
                <td>
                    <select class="t-tip" title="Choose  or add" name="catSoftwaresAvailable" id="os-left" size="8" multiple="multiple">
                        <c:forEach items="${actionBean.computerOses}" var="os">
                            <option value="${os.selectionId}">${os.selectionName}</option>
                        </c:forEach>
                    </select>
                </td>

                <td class="low" rowspan="2">
                    <input class="p-button" name="os-left2os-right" value="&nbsp;&nbsp;&nbsp;&nbsp;add >>&nbsp;&nbsp;&nbsp;" type="button"><br/><br/>
                    <input class="p-button" name="os-right2os-left" value="<< remove" type="button">
                </td>

                <td rowspan="2">
                    <select class="multi-select-right" name="userProfile.computerOsIds" id="os-right" size="10" multiple="multiple">
                        <c:forEach items="${actionBean.userProfile.computerOses}" var="userOs">
                            <c:choose>
                                <c:when test="${userOs.customSelection}">
                                    <option value="${userOs.selectionValue}">${userOs.selectionValue}</option>
                                </c:when>
                                <c:otherwise>
                                    <option value="${userOs.selectionId}">${userOs.selectionValue}</option>
                                </c:otherwise>
                            </c:choose>
                        </c:forEach>
                    </select>
                </td>
                <td rowspan="2">
                    <div class="public-private-switch" tabindex="0">
                            <%--${actionBean.userProfile.computerOsPublic}--%>
                        <stripes:hidden class="p-p-input" name="userProfile.computerOsPublic"/>
                        <c:choose>
                            <c:when test="${actionBean.userProfile.computerOsPublic}">
	                    		<span class="public-private-button public t-tip" title="<fmt:message bundle='${help}' key='help.profile.PUBLIC' />">Public</span>
                            </c:when>
                            <c:otherwise>
								<span class="public-private-button  t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
                            </c:otherwise>
                        </c:choose>

                    </div>

                </td>
            </tr>
            <tr>
                <td>
                    <input type="text" class="multi-select-add-text t-tip" title="<fmt:message bundle='${help}' key='help.profile.COMPUTER_OPERATING_SYSTEM_ADD' />">
                    <span class="p-button p-5" id="os-add" title="<fmt:message bundle='${help}' key='help.profile.COMPUTER_OPERATING_SYSTEM_ADD' />">Add &gt;&gt;</span>
                </td>
            </tr>
        </table>
    </div>
</div>



<div class="h3">Jobs Preferred<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.JOBS_PREFERRED' />" id="toolTipImage"></span></div>

<div class="profile-block">
    <div class="p-5">
        <table>
            <tr>
                <td>
                    <select title="Choose all that apply or add" class="t-tip" name="catSoftwaresAvailable" id="jobs-left" size="8" multiple="multiple">
                        <c:forEach items="${actionBean.jobTypes}" var="jobs">
                            <option value="${jobs.selectionId}">${jobs.selectionName}</option>
                        </c:forEach>
                    </select>
                </td>

                <td class="low" rowspan="2">
                    <input class="p-button" name="jobs-left2jobs-right" value="&nbsp;&nbsp;&nbsp;&nbsp;add >>&nbsp;&nbsp;&nbsp;" type="button"><br/><br/>
                    <input class="p-button" name="jobs-right2jobs-left" value="<< remove" type="button">
                </td>

                <td rowspan="2">
                    <select class="multi-select-right" name="userProfile.jobTypeIds" id="jobs-right" size="10" multiple="multiple">
                        <c:forEach items="${actionBean.userProfile.jobTypes}" var="userJobs">
                            <c:choose>
                                <c:when test="${userJobs.customSelection}">
                                    <option value="${userJobs.selectionValue}">${userJobs.selectionValue}</option>
                                </c:when>
                                <c:otherwise>
                                    <option value="${userJobs.selectionId}">${userJobs.selectionValue}</option>
                                </c:otherwise>
                            </c:choose>
                        </c:forEach>
                    </select>
                </td>
                <td rowspan="2">
                    <div class="public-private-switch" tabindex="0">
                        <stripes:hidden class="p-p-input" name="userProfile.jobPublic"/>
                        <c:choose>
                            <c:when test="${actionBean.userProfile.jobPublic}">
	                    		<span class="public-private-button public t-tip" title="<fmt:message bundle='${help}' key='help.profile.PUBLIC' />">Public</span>
                            </c:when>
                            <c:otherwise>
								<span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
                            </c:otherwise>
                        </c:choose>
                    </div>
                </td>
            </tr>
            <tr>
                <td>
                    <input type="text" class="multi-select-add-text">
                    <span class="p-button p-5" id="job-add">Add &gt;&gt;</span>
                </td>
            </tr>
        </table>
    </div>
</div>

<div class="h3 p-5">Travel Information<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.TRAVEL_INFORMATION' />" id="toolTipImage"></span></div>
<div class="profile-block">
    <div class="p-5">
       
              <div  class="f-l p-5">
                    <stripes:label for="userProfile.hasPassport" >Have Passport</stripes:label>
                    <stripes:checkbox title="Check if yes" class="inputs t-tip" name="userProfile.hasPassport" /> </div>
                <div  class="f-l p-5">
				 <div  class="f-l p-5 travelinfo">
               <!-- <label>Willing to Travel </label>-->
				<div class="clear"></div>
				<div  class="f-l p-5 clear">
                    <stripes:label for="willingToTravelOutOfCountry"> Willing to Travel Out of the Country </stripes:label><span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.TRAVEL_INFORM_OUT_OF_COUNTRY' />" id="toolTipImage"></span>
                    <stripes:checkbox class="t-tip" title="Check if yes - you travel out of the country to cover jobs" id="willingToTravelOutOfCountry" style="margin:2px;" name="userProfile.willingToTravelOutOfCountry" />
					 <stripes:label for="countrynotes">Note</stripes:label>
	                <stripes:textarea title="Add notes regarding any travel  EXTRA: expand box by clicking on right lower corner" class="t-tip" id="countryNotes" name="userProfile.countryNotes"/>
                </div> 				
                   
				 <div  class="f-l p-5 clear">
                    <stripes:label for="willingToTravelOutOfState"> Willing to Travel Out of the State </stripes:label><span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.TRAVEL_INFORM_OUT_OF_STATE' />" id="toolTipImage"></span>
                    <stripes:checkbox title="check if yes - you travel out of state to cover jobs" class="t-tip" style="margin-left:16px;" id="willingToTravelOutOfState" name="userProfile.willingToTravelOutOfState" />
   				    <stripes:label for="statenotes">Note</stripes:label>
	                <stripes:textarea id="stateNotes" title="Add notes regarding any travel  EXTRA: expand box by clicking on right lower corner" class="t-tip" name="userProfile.stateNotes"/>
                </div>
                 <div  class="f-l p-5 clear">
                    <stripes:label for="willingToTravelOutOfArea">Willing to Travel Out of the Area </stripes:label><span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.TRAVEL_INFORM_OUT_OF_AREA' />" id="toolTipImage"></span>
                    <stripes:checkbox title="check if yes - you travel out of state to cover jobs" class="t-tip" id="willingToTravelOutOfArea" style="margin-left:21px;" name="userProfile.willingToTravelOutOfArea" />
					<stripes:label for="areanotes">Note</stripes:label>
	                <stripes:textarea title="Add notes regarding any travel  EXTRA: expand box by clicking on right lower corner" class="t-tip" id="areaNotes" name="userProfile.areaNotes"/>
                </div>
				
                 
				
				</div></div>
                 
                 <div  class="f-l p-5 clear">
                    <div class="public-private-switch" tabindex="0">
                        <stripes:hidden class="p-p-input" name="userProfile.travelInfoPublic"/>
                        <c:choose>
                            <c:when test="${actionBean.userProfile.travelInfoPublic}">
	                    		<span class="public-private-button public t-tip" title="<fmt:message bundle='${help}' key='help.profile.PUBLIC' />">Public</span>
                            </c:when>
                            <c:otherwise>
								<span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
                            </c:otherwise>
                        </c:choose>
                    </div>
                </div>
            

    </div>
	<div class="clear"></div>
</div>

<div class="h3">Location Preferences<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.PREFERENCEC' />" id="toolTipImage"></span></div>
<c:set var="locIndex" value="0" scope="page" />
<c:forEach items="${actionBean.userProfile.locations}" var="loc" varStatus="locLoop">

<div id="locTemplate-${locLoop.index}" class="profile-block">
	<stripes:hidden	name="userProfile.locations[${locLoop.index}].locationId" value="${loc.locationId}"/>
    <stripes:hidden name="userProfile.contacts[${locLoop.index}].userId" value="${loc.userId}"/>
	<div  class="f-l p-5">
		<stripes:select id="locationType[${locLoop.index}]" name="userProfile.locations[${locLoop.index}].locationType">
	    <stripes:options-collection collection="${actionBean.locationTypes}" value="locationType" label="name"/>
	    </stripes:select>
    </div>
    
     <div class="f-l p-5">
     	<stripes:text maxlength="99" id="locationValue[${locLoop.index}]" name="userProfile.locations[${locLoop.index}].locationValue"/>
    </div>
	
	<div class="f-l p-5">
		<stripes:label for="notes[${locLoop.index}]">Notes</stripes:label>
		<stripes:textarea title="Enter notes regarding preference" class="t-tip" id="notes[${locLoop.index}]" name="userProfile.locations[${locLoop.index}].notes"/>
	</div>
	
	<div class="f-l p-5">
    	<div class="public-private-switch" tabindex="0">
        	<stripes:hidden class="p-p-input" name="userProfile.locations[${locLoop.index}].public"/>
            <c:choose>
            <c:when test="${loc.public}">
	             <span class="public-private-button public t-tip" title="<fmt:message bundle='${help}' key='help.profile.PUBLIC' />">Public</span>
            </c:when>
            
            <c:otherwise>
				<span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
            </c:otherwise>
            </c:choose>
    	</div>
	</div>
	
	<div class="f-l p-5">
    	<div class="p-0">
	    	<stripes:hidden class="delete-input" name="userProfile.locations[${locLoop.index}].deleted"/>
	        <span class="delete-button p-button p-5" template="locTemplate-${locLoop.index}">Delete</span>
        </div>
    </div>
    
    <div class="clear"></div>
</div>

<c:set var="locIndex" value="${locLoop.index + 1}"/>

</c:forEach>
<div id="loc-placeholder" class="hidden clear"></div>

<div class="profile-block">
    <div class="clear">
        <span id="addLoc" class="p-5 add-button p-button">Add Preferences</span>
		<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.ADD_PREFERENCES' />" id="toolTipImage"></span>
    </div>
</div>
<%-- Locations- END --%>

<%--
<div class="profile-block">
    <div>
        <table>
            <tr>
                <td>
                    <stripes:label for="primaryLocation">Primary Location</stripes:label>
                </td>
                <td>
                    <stripes:text id="primaryLocation" name="userProfile.primaryLocation" />
                </td>
                <td>
                    <stripes:label for="secondaryLocation">Secondary Location</stripes:label>
                </td>
                <td>
                    <stripes:text id="secondaryLocation" name="userProfile.secondaryLocation" />
                </td>
                
                <td>
                 <div>
                  <span id="addPreferences" class="p-5 add-button p-button"> Add Preferences</span>
                  </div>
                </td>
                <td>
                    <div class="public-private-switch" tabindex="0">
                        <stripes:hidden class="p-p-input" name="userProfile.preferencePublic"/>
                        <c:choose>
                            <c:when test="${actionBean.userProfile.preferencePublic}">
                                <span class="public-private-button tip public">Public</span>
                            </c:when>
                            <c:otherwise>
                                <span class="public-private-button">Private</span>
                            </c:otherwise>
                        </c:choose>
                    </div>
                </td>
            </tr>
        </table>

    </div>
</div>
 --%>
<div class="h3">Specialties<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.SPECIALTIES' />" id="toolTipImage"></span></div>

<div class="profile-block">
    <div class="p-5">
        <table>
            <tr>
                <td>
                    <select title="<fmt:message bundle='${help}' key='help.profile.SPECIALTIES' />" class="t-tip" name="catSoftwaresAvailable" id="specialities-left" size="8" multiple="multiple">
                        <c:forEach items="${actionBean.specialities}" var="specialities">
                            <option value="${specialities.selectionId}">${specialities.selectionName}</option>
                        </c:forEach>
                    </select>
                </td>

                <td class="low" rowspan="2">
                    <input class="p-button" name="specialities-left2specialities-right" value="&nbsp;&nbsp;&nbsp;&nbsp;add >>&nbsp;&nbsp;&nbsp;" type="button"><br/><br/>
                    <input class="p-button" name="specialities-right2specialities-left" value="<< remove" type="button">
                </td>

                <td rowspan="2">
                    <select class="multi-select-right" name="userProfile.specialityIds" id="specialities-right" size="10" multiple="multiple">
                        <c:forEach items="${actionBean.userProfile.specialities}" var="userSpecialities">
                            <c:choose>
                                <c:when test="${userSpecialities.customSelection}">
                                    <option value="${userSpecialities.selectionValue}">${userSpecialities.selectionValue}</option>
                                </c:when>
                                <c:otherwise>
                                    <option value="${userSpecialities.selectionId}">${userSpecialities.selectionValue}</option>
                                </c:otherwise>
                            </c:choose>
                        </c:forEach>
                    </select>
                </td>
                <td rowspan="2">
                    <div class="public-private-switch" tabindex="0">
                        <stripes:hidden class="p-p-input" name="userProfile.specialtyPublic"/>
                        <c:choose>
                            <c:when test="${actionBean.userProfile.specialtyPublic}">
	                    		<span class="public-private-button public t-tip" title="<fmt:message bundle='${help}' key='help.profile.PUBLIC' />">Public</span>
                            </c:when>
                            <c:otherwise>
								<span class="public-private-button  t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
                            </c:otherwise>
                        </c:choose>
                    </div>
                </td>
            </tr>
            <tr>
                <td>
                    <input type="text" class="multi-select-add-text t-tip" title="<fmt:message bundle='${help}' key='help.profile.SPECIALTIES_ADD' />" class="t-tip">
                    <span class="p-button p-5" id="specialty-add" title="<fmt:message bundle='${help}' key='help.profile.SPECIALTIES_ADD' />">Add &gt;&gt;</span>
                </td>
            </tr>
        </table>
    </div>
</div>


<div class="h3">Expertise<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.EXPERTISE' />" id="toolTipImage"></span></div>

<div class="profile-block">
    <div class="p-5">
        <table>
            <tr>
                <td>
                    <select title="<fmt:message bundle='${help}' key='help.profile.EXPERTISE' />" class="t-tip" name="expertisesAvailable" id="expertises-left" size="8" multiple="multiple">
                        <c:forEach items="${actionBean.expertises}" var="expertises">
                            <option value="${expertises.selectionId}">${expertises.selectionName}</option>
                        </c:forEach>
                    </select>
                </td>

                <td class="low" rowspan="2">
                    <input class="p-button" name="expertises-left2expertises-right" value="&nbsp;&nbsp;&nbsp;&nbsp;add >>&nbsp;&nbsp;&nbsp;" type="button"><br/><br/>
                    <input class="p-button" name="expertises-right2expertises-left" value="<< remove" type="button">
                </td>

                <td rowspan="2">
                    <select class="multi-select-right" name="userProfile.expertiseIds" id="expertises-right" size="10" multiple="multiple">
                        <c:forEach items="${actionBean.userProfile.expertises}" var="userExpertises">
                            <c:choose>
                                <c:when test="${userExpertises.customSelection}">
                                    <option value="${userExpertises.selectionValue}">${userExpertises.selectionValue}</option>
                                </c:when>
                                <c:otherwise>
                                    <option value="${userExpertises.selectionId}">${userExpertises.selectionValue}</option>
                                </c:otherwise>
                            </c:choose>
                        </c:forEach>
                    </select>
                </td>
                <td rowspan="2">
                    <div class="public-private-switch" tabindex="0">
                        <stripes:hidden class="p-p-input" name="userProfile.expertisePublic"/>
                        <c:choose>
                            <c:when test="${actionBean.userProfile.expertisePublic}">
	                    		<span class="public-private-button public t-tip" title="<fmt:message bundle='${help}' key='help.profile.PUBLIC' />">Public</span>
                            </c:when>
                            <c:otherwise>
							     <span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
                            </c:otherwise>
                        </c:choose>
                    </div>
                </td>
            </tr>
            <tr>
                <td>
                    <input type="text" class="multi-select-add-text t-tip" title="<fmt:message bundle='${help}' key='help.profile.EXPERTISE_ADD' />">
                    <span class="p-button p-5" id="expertise-add" title="<fmt:message bundle='${help}' key='help.profile.EXPERTISE_ADD' />">Add &gt;&gt;</span>
                </td>
            </tr>
        </table>
    </div>
</div>


<div class="h3">Hobbies<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.HOBBIES' />" id="toolTipImage"></span></div>

<div class="profile-block">
    <div class="p-5">
        <table>
            <tr>
                <td>
                    <select title="<fmt:message bundle='${help}' key='help.profile.HOBBIES' />" class="t-tip" name="catSoftwaresAvailable" id="hobbies-left" size="8" multiple="multiple">
                        <c:forEach items="${actionBean.hobbies}" var="hobbies">
                            <option value="${hobbies.selectionId}">${hobbies.selectionName}</option>
                        </c:forEach>
                    </select>
                </td>

                <td class="low" rowspan="2">
                    <input class="p-button" name="hobbies-left2hobbies-right" value="&nbsp;&nbsp;&nbsp;&nbsp;add >>&nbsp;&nbsp;&nbsp;" type="button"><br/><br/>
                    <input class="p-button" name="hobbies-right2hobbies-left" value="<< remove" type="button">
                </td>

                <td rowspan="2">
                    <select class="multi-select-right" name="userProfile.hobbyIds" id="hobbies-right" size="10" multiple="multiple">
                        <c:forEach items="${actionBean.userProfile.hobbies}" var="userHobbies">
                            <c:choose>
                                <c:when test="${userHobbies.customSelection}">
                                    <option value="${userHobbies.selectionValue}">${userHobbies.selectionValue}</option>
                                </c:when>
                                <c:otherwise>
                                    <option value="${userHobbies.selectionId}">${userHobbies.selectionValue}</option>
                                </c:otherwise>
                            </c:choose>
                        </c:forEach>
                    </select>
                </td>
                <td rowspan="2">
                    <div class="public-private-switch" tabindex="0">
                        <stripes:hidden class="p-p-input" name="userProfile.hobbyPublic"/>
                        <c:choose>
                            <c:when test="${actionBean.userProfile.hobbyPublic}">
	                    		<span class="public-private-button public t-tip" title="<fmt:message bundle='${help}' key='help.profile.PUBLIC' />">Public</span>
                            </c:when>
                            <c:otherwise>
								<span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
                            </c:otherwise>
                        </c:choose>
                    </div>
                </td>
            </tr>
            <tr>
                <td>
                    <input type="text" class="multi-select-add-text t-tip" title="<fmt:message bundle='${help}' key='help.profile.HOBBIES_ADD' />">
                    <span class="p-button p-5" id="hobby-add" title="<fmt:message bundle='${help}' key='help.profile.HOBBIES_ADD' />">Add &gt;&gt;</span>
                </td>
            </tr>
        </table>
    </div>
</div>



<div class="h3" >Availability Schedule<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.AVAILABILITY_SCHEDULE' />" id="toolTipImage"></span></div>

<div class="groupBox">
<p class="pad5">
<span class="bold">Apply To Monday Through Friday</span><span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.APPLY_TO_MONDAY_THROUGH_FRIDAY' />" id="toolTipImage"></span>
<stripes:checkbox name="userProfile.timeschedule" id="timeschedule" title="Enter start and end times when you are available" class="t-tip"/>
<span class="bold" style="inline-block;width:200px;">Time Format</span>



<select id="hourType" name="userProfile.hourType">
<c:forEach items="${actionBean.hourTypes}" var="hourType">
<c:if test="${actionBean.userProfile.hourType == hourType.typeId}">
<option value="${hourType.typeId}" selected>${hourType.typeName}</option>
</c:if>

<c:if test="${actionBean.userProfile.hourType != hourType.typeId}">
<option value="${hourType.typeId}">${hourType.typeName}</option>
</c:if>
</c:forEach>
</select>

<!--<select name="userProfile.hourType" value="" id="hourType" onChange="callForTime();">
<option value="1" >12 Hour</option>
<option value="2">24 Hour</option>
</select>-->
<span id="availabilityScheErrorSpan" style="margin-left: 35px;color:red"></span>
</p>

<ul class="timings f-l">
<li>
<span>Monday</span>

<stripes:text name="userProfile.mondayFrom" id="mondayFrom" class="time" />
<span> to </span>
<stripes:text name="userProfile.mondayTo" id="mondayTo" class="time" />
</li>
<li>
<span>Tuesday</span>
<stripes:text name="userProfile.tuesdayFrom" id="tuesdayFrom" class="time" />
<span> to </span>
 <stripes:text name="userProfile.tuesdayTo" id="tuesdayTo" class="time" />
</li>
<li>
<span>Wednesday</span>
<stripes:text name="userProfile.wednesdayFrom" id="wednesdayFrom" class="time" />
<span> to </span>
<stripes:text name="userProfile.wednesdayTo" id="wednesdayTo" class="time"/>
</li>
<li>
<span>Thursday</span>
<stripes:text name="userProfile.thursdayFrom" id="thursdayFrom" class="time" />
<span> to </span>
<stripes:text name="userProfile.thursdayTo" id="thursdayTo" class="time" />
</li>
<li>
<span>Friday</span>
 <stripes:text name="userProfile.fridayFrom" id="fridayFrom" class="time" />
<span> to </span>
<stripes:text name="userProfile.fridayTo" id="fridayTo" class="time" />
</li>
<li>
<span>Saturday</span>
<stripes:text name="userProfile.saturdayFrom" id="saturdayFrom" class="time" />
<span> to </span>
<stripes:text name="userProfile.saturdayTo" id="saturdayTo" class="time" />
</li>
<li>
<span>Sunday</span>
<stripes:text name="userProfile.sundayFrom" id="sundayFrom" class="time" />
<span> to </span>
<stripes:text name="userProfile.sundayTo" id="sundayTo" class="time" />
</li>
</ul>
<div class="avaliScheNotes f-l p-5">
<stripes:label for="avaliScheduleNotes"><span class="f-l p-5">Notes: </span></stripes:label>
	 <stripes:textarea id="avaliScheduleNotes" name="userProfile.avaliabilityScheduleNotes" title="Enter notes regarding schedule - update note as needed" class="t-tip"/>
 </div>
</div>

    <%--submit buttons--%>

<div class="profile-buttons">

<div class="f-l p-5">
        <stripes:button class="button t-tip unload sendProfile" id="accountreceivableProfiles"  name="SEND PROFILE" value="Send Profile" title="Send your public profile to account receivable" />
        <div class="button-end"></div>
    </div>

    <div class="f-l p-5">

        <stripes:submit class="button t-tip" name="preview" value="Preview" title="Preview public profile" />
        <div class="button-end"></div>
    </div>
    <div class="f-l p-5">
        <stripes:submit class="button t-tip" name="save" value="Save" title="Save"/>
        <div class="button-end"></div>
    </div>
    <div class="f-l p-5">
        <stripes:button id="cancelId" class="button t-tip cancel" name="cancel" value="Cancel" title="Cancel"/>
        <div class="button-end"></div>

		 <div id="showconfirmDiv">
           <div id="showDiv"></div>
     </div>
    </div>
    
    <div class="clear"></div>
</div>

</div>
<div class="profile-right-container">
	<h1>My Hours to Perform Task<span style="" class="toolTip" title="<fmt:message bundle='${help}' key='help.profile.HOURS_TO_PERFORM' />" id="toolTipImage"></span></h1>

	<div class="profile-hours-container">
		<div class="profile-hours-block">
			<h2><span class="regular">Regular</span>-  Number of Pages an Hour</h2>
			<div class="input-field">
				<stripes:label for="regSkillScope">Scope</stripes:label>
	            <stripes:text maxlength="10" id="regSkillScope" name="userProfile.regSkillScope" class="mandatoryfield numberVal"/>
			</div>
			<div class="input-field">
				<stripes:label for="regSkillProof">Proof</stripes:label>
	             <stripes:text maxlength="10" id="regSkillProof" name="userProfile.regSkillProof" class="mandatoryfield numberVal"/>
			</div>
			<div class="f-l p-5">
			<stripes:label for="regularDefault"><span class="radioclass"> <stripes:radio id="regularDefault" name="userProfile.defaultSkillType" value="1"/></span> Set as Default </stripes:label>	
			</div>
		</div>
		<div class="profile-hours-block">
			<h2><span class="dense">Dense</span>-  Number of Pages an Hour</h2>
			<div class="input-field">
				<stripes:label for="denseSkillScope">Scope</stripes:label>
	            <stripes:text maxlength="10" id="denseSkillScope" name="userProfile.denseSkillScope" class="mandatoryfield numberVal"/>
			</div>
			<div class="input-field">
				<stripes:label for="denseSkillProof">Proof</stripes:label>
	             <stripes:text maxlength="10" id="denseSkillProof" name="userProfile.denseSkillProof" class="mandatoryfield numberVal"/>
			</div>
			<div class="f-l p-5">
				<stripes:label for="denseDefault"> <span class="radioclass"><stripes:radio id="denseDefault" name="userProfile.defaultSkillType" value="2"/></span> Set as Default </stripes:label>	
			</div>	
		</div>
		<div class="profile-hours-block">
			<h2><span class="easy">Easy</span>-  Number of Pages an Hour</h2>
			<div class="input-field">
				<stripes:label for="easySkillScope" >Scope</stripes:label>
	            <stripes:text maxlength="10" id="easySkillScope" name="userProfile.easySkillScope" class="mandatoryfield numberVal"/>
			</div>
			<div class="input-field">
				<stripes:label for="easySkillProof">Proof</stripes:label>
	             <stripes:text maxlength="10" id="easySkillProof" name="userProfile.easySkillProof" class="mandatoryfield numberVal"/>
			</div>
			<div class="f-l p-5">
			<stripes:label for="easyDefault"> <span class="radioclass"><stripes:radio id="easyDefault" name="userProfile.defaultSkillType" value="3"/></span> Set as Default </stripes:label>			
			</div>
		
		</div>
		<div class="f-l p-5 skillAdminHrs">
		<stripes:label for="skillAdminHrs" >
        Administrative Hours</stripes:label>
		<stripes:text maxlength="10" id="skillAdminHrs" name="userProfile.skillAdminHrs" style="width:50px;border-radius: 5px 5px 5px 5px;" class="mandatoryfield numberVal"/>
		</div>
	</div>
</div>

</div>


<div id="addressTemplate" class="profile-block template">
    <div class="f-l p-5 addressarea">
        <label for="address1[{index}]" >Address1</label>
        <input type="text" maxlength="49" class="t-tip" id="address1[{index}]" name="userProfile.addresses[{index}].address1"  title="Number and Street Name"/>
    </div>
    <div class="f-l p-5 addressarea">
        <label for="address2[{index}]"  >Address2</label>
        <input type="text" maxlength="49" class="t-tip" id="address2[{index}]" name="userProfile.addresses[{index}].address2" title="Apartment, Unit or Suite Number, if applicable" />
    </div>
    <div  class="f-l p-5">
        <label for="city[{index}]" >City</label>
        <input type="text" maxlength="49" id="city[{index}]" name="userProfile.addresses[{index}].city" title="City" class="t-tip"/>
    </div>
        <%--<div class="clear"></div>--%>
    <div  class="f-l p-5">
        <label for="state[{index}]" >State</label>
        <!-- <select class="t-tip" id="state[{index}]" name="userProfile.addresses[{index}].state" title="State">
            <option value="">State</option>
            <c:forEach items="${actionBean.usaStates}" var="state">
                <option value="${state.shortName}">${state.shortName}</option>
            </c:forEach>
        </select> -->
        
    <stripes:text maxlength="10" id="state[{index}]" name="userProfile.addresses[{index}].state" title="State" class="usaStates t-tip"/>
        
    </div>
    <div  class="f-l p-5">
        <label for="zip[{index}]" >ZIP</label>
        <input type="text" maxlength="10" class="t-tip zipval" id="zip[{index}]" name="userProfile.addresses[{index}].zip" title="ZIP"/>
    </div>
    <!--div  class="f-l p-5 primary-email">
        <label for="primayEmail[{index}]">Primary Email</label>
        <input type="text" id="primayEmail[{index}]" name="userProfile.addresses[{index}].primaryEmail"/>
    </div>-->
    <!--<div  class="f-l p-5 primary-phone">
        <label for="primaryPhoneNumber[{index}]">primaryPhoneNumber</label>
        <stripes:text id="primaryPhoneNumber[${aLoop.index}]" name="userProfile.addresses[{index}].primaryPhoneNumber"/>
    </div>-->
    <!--<div  class="f-l p-5 secondary-email">
        <label for="secondaryEmail[{index}]">secondaryEmail</label>
        <stripes:text id="secondaryEmail[${aLoop.index}]" name="userProfile.addresses[{index}].secondaryEmail"/>
   <div  class="f-l p-5 secondary-phone">
        <label for="secondaryPhoneNumber[{index}]">secondaryPhoneNumber</label>
        <stripes:text id="secondaryPhoneNumber[${aLoop.index}]" name="userProfile.addresses[{index}].secondaryPhoneNumber"/>
    </div>-->

	 <div  class="f-l p-5">
        <label for="timeZone[{index}]" title="<fmt:message bundle='${help}' key='help.profile.TIME_ZONE' />">Time Zone</label>
            <stripes:select class="timeZone t-tip" id="timeZone[{index}]" name="userProfile.addresses[{index}].timeZone" title="Select for this address">
                <c:forEach items="${actionBean.timeZones}" var="tZone">
                 <option value="${tZone.timeZoneId}">${tZone.timeZoneValue}</option>
            </c:forEach>
            </stripes:select>
    </div>
    <div class="f-l p-5">
        <div class="public-private-switch" tabindex="0">
            <input type="hidden" class="p-p-input" name="userProfile.addresses[{index}].public" value="false"/>
				<span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
        </div>
    </div>
    <div class="f-l p-5">
        <div class="p-0">
            <input type="hidden" class="delete" name="userProfile.addresses[{index}].deleted" value="false"/>
            <span class="delete-button p-button p-5" template="addressTemplate-{index}">Delete</span>
        </div>
    </div>
    <div class="clear"></div>
</div>
<div id="addressIndex" class="template clear">${aIndex}</div>

<div id="phoneTemplate" class="profile-block template">
    
    <div class="f-l p-5">
            <%--<label for="contactType[{index}]">Contact Type</label>--%>
        <select class="t-tip" title="Select primary phone - indicate home, cell, business" id="contactType[{index}]" name="userProfile.contacts[{index}].contactType">
               		<option value="1">Primary Phone</option>
                    <option value="3">Home Phone</option>
                    <option value="4">Cell Phone</option>
                    <option value="5">Work Phone</option>
                    <option value="6">Emergency Phone</option>
                    <option value="7">Fax</option>
        </select>
    </div>
    <div class="f-l p-5">
            <%--<label for="contactValue[{index}]">Contact Value</label>--%>
        <input type="text" maxlength="99" title="Enter primary phone - indicate home, cell, business" class="t-tip phoneval" id="contactValue[{index}]" name="userProfile.contacts[{index}].contactValue"/>
    </div>
    
    <div class="f-l p-5">
        <div class="public-private-switch" tabindex="0">
            <input type="hidden" class="p-p-input" name="userProfile.contacts[{index}].public" value="false"/>
				<span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
        </div>
    </div>
    <div class="f-l p-5">
        <div class="p-0">
            <input type="hidden" class="delete-input" name="userProfile.contacts[{index}].deleted" value="false"/>
            <span class="delete-button p-button p-5" template="phoneTemplate-{index}">Delete</span>
        </div>
    </div>
    <div class="clear"></div>
</div>

<div id="emailTemplate" class="profile-block template">
    <div class="f-l p-5">
            <%--<label for="contactType[{index}]">Contact Type</label>--%>
        <select id="contactType[{index}]" name="userProfile.contacts[{index}].contactType" title="Select e-mail Type" class="t-tip" >
                  	<option value="2"> Primary Email</option>
                	<option value="8"> Other Email</option>
        </select>
    </div>
    <div class="f-l p-5">
            <%--<label for="contactValue[{index}]">Contact Value</label>--%>
        <input type="text" maxlength="99" class="emailval t-tip" id="contactValue[{index}]" name="userProfile.contacts[{index}].contactValue" title="Enter secondary e-mail"/>
    </div>
    <div class="f-l p-5">
        <div class="public-private-switch" tabindex="0">
            <input type="hidden" class="p-p-input" name="userProfile.contacts[{index}].public" value="false"/>
			<span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
        </div>
    </div>
    <div class="f-l p-5">
        <div class="p-0">
            <input type="hidden" class="delete-input" name="userProfile.contacts[{index}].deleted" value="false"/>
            <span class="delete-button p-button p-5" template="emailTemplate-{index}">Delete</span>
        </div>
    </div>
    <div class="clear"></div>
</div>

<div id="contactIndex" class="template clear">${cIndex}</div>

    <div id="emergencyContactTemplate" class="profile-block template emergencycontact">
        <div class="f-l p-5">
        <label for="emergencyContactType[{index}]" >Emergency Contact Type</label>
            <select class="t-tip" id="emergencyContactType[{index}]" name="userProfile.emergencyContacts[{index}].emergencyContactType" title="Select one">  
            <c:forEach items="${actionBean.emergencyContactTypes}" var="cT">
                 <option value="${cT.emergencyContactTypeId}">${cT.name}</option>
            </c:forEach>
           </select>
        </div>
        <div class="f-l p-5">
                   <label for="emergencyContactName[{index}]" >Name</label>
               <input maxlength="99" type="text" class="t-tip" id="emergencyContactName[{index}]" name="userProfile.emergencyContacts[{index}].name" title=" First and Last Name"/>
        </div>
        <div class="f-l p-5 errphonemsg">
           <label for="emergencyContactPhone[{index}]" >Phone</label>
               <input maxlength="99" type="text" class="t-tip phoneval" id="emergencyContactPhone[{index}]" name="userProfile.emergencyContacts[{index}].phone" title="Enter phone number"/>
        </div>
        <div class="f-l p-5">
           <label for="emergencyContactEmail[{index}]" >Email</label>
               <input maxlength="99" type="text" class="t-tip emailval" id="emergencyContactEmail[{index}]" name="userProfile.emergencyContacts[{index}].email" title="Enter email" />
        </div>
        <div class="f-l p-5">
        <div class="public-private-switch" tabindex="0">
            <input type="hidden" class="p-p-input" name="userProfile.emergencyContacts[{index}].public" value="false"/>
			<span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
        </div>
      </div>
      <div class="f-l p-5">
        <div class="p-0">
            <input type="hidden" class="delete-input" name="userProfile.emergencyContacts[{index}].deleted" value="false"/>
            <span class="delete-button p-button p-5" template="emergencyContactTemplate-{index}">Delete</span>
        </div>
     </div>
   <div class="clear"></div>
</div>
<div id="emergencyContactIndex" class="template clear">${ecIndex}</div>

<div id="certTemplate" class="profile-block template">
    <stripes:hidden	name="userProfile.certificates[{index}].certificateId"/>
    <stripes:hidden name="userProfile.certificates[{index}].userId"/>

    <div class="f-l p-5">
        <label for="certificateType[{index}]">Certificate Type</label>
        <stripes:select id="certificateType[{index}]" name="userProfile.certificates[{index}].certificateType" class="certificateType t-tip" title="Choose or add certification or degree">
            <stripes:options-collection collection="${actionBean.certificateTypes}" label="certificateTypeName" value="certificateTypeId"/>
        </stripes:select>
    </div>
    <div class="f-l p-5 hiddenTextBox">
            <span class="toolTip-cust">
			<span class="toolTip-caption" style="display: none;">Enter Other Certificate Type</span>
            <stripes:text maxlength="99" id="certificateTypeOther[{index}]" name="userProfile.certificates[{index}].certificateTypeOther" class="certificateTypeOther t-tip" title="Enter Other Certificate Type"/>
			</span>
        </div>
        <div class="f-l p-5">
            <label for="certificateCateg[{index}]" >Level</label>
            <stripes:select id="certificateCateg[{index}]" name="userProfile.certificates[{index}].certifCategType" class="certificateLevel t-tip" title="Select one">
                <stripes:options-collection collection="${actionBean.certifCategTypes}" label="name" value="certifCategTypeId"/>
            </stripes:select>
        </div>
        <div class="f-l p-5">
            <label for="certificateCategVal[{index}]"></label>
            <stripes:text maxlength="49" class="autoCert t-tip" id="certificateCategVal[{index}]" name="userProfile.certificates[{index}].certificateState" title="Enter State or Country"/>
        </div>

		
        <div class="f-l p-5">
            <label for="issuingBody[{index}]" >Issuing Body</label>
            <stripes:text maxlength="99" class="t-tip" id="issuingBody[{index}]" name="userProfile.certificates[{index}].issuingBody" title="Certification or degree from name of issuer"/>
        </div>
    
   <!--   <div class="f-l p-5">
        <label for="certificateState[{index}]">State</label>
        <stripes:select id="certificateState[{index}]" name="userProfile.certificates[{index}].certificateState">
            <option value="">State</option>
            <stripes:options-collection collection="${actionBean.usaStates}" value="shortName" label="fullName"/>
        </stripes:select>
    </div> -->
    <div class="f-l p-5">
        <label for="certificateNumber[{index}]">Certificate Number/Year</label>
        <stripes:text maxlength="99" class="t-tip" id="certificateNumber[{index}]" name="userProfile.certificates[{index}].certificateNumber" title="Enter certification number or year received or both"/>
    </div>

    <div class="f-l p-5">
        <div class="public-private-switch" tabindex="0">
            <input type="hidden" class="p-p-input" name="userProfile.certificates[{index}].public" value="false"/>
			<span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
        </div>
    </div>
    <div class="f-l p-5">
        <div class="p-0">
            <input type="hidden" class="delete-input" name="userProfile.certificates[{index}].deleted" value="false"/>
            <span class="delete-button p-button p-5" template="certTemplate-{index}">Delete</span>
        </div>
    </div>
    <div class="clear"></div>
</div>
<div id="certIndex" class="template clear">${certIndex}</div>
<stripes:hidden name="selectionItemType" value="true" />
<div id="locTemplate" class="profile-block template">
	<stripes:hidden	name="userProfile.locations[{index}].locationId" value="0"/>
    <stripes:hidden name="userProfile.locations[{index}].userId"/>
	
	<div  class="f-l p-5">
		<stripes:select id="locationType[{index}]" name="userProfile.locations[{index}].locationType">
	    <stripes:options-collection collection="${actionBean.locationTypes}" value="locationType" label="name"/>
	    </stripes:select>
	</div>
	
    <div class="f-l p-5">
        <stripes:text maxlength="99" id="locationValue[{index}]" name="userProfile.locations[{index}].locationValue"/>
    </div>
		    
	<div class="f-l p-5">
		<stripes:label for="notes[{index}]" >Notes</stripes:label>
		<stripes:textarea id="notes[{index}]" name="userProfile.locations[{index}].notes" title="Enter notes regarding preference" class="t-tip"/>
	</div>
	
    <div class="f-l p-5">
        <div class="public-private-switch" tabindex="0">
            <input type="hidden" class="p-p-input" name="userProfile.locations[{index}].public" value="false"/>
			<span class="public-private-button t-tip" title="<fmt:message bundle='${help}' key='help.profile.PRIVATE' />">Private</span>
        </div>
    </div>
    <div class="f-l p-5">
        <div class="p-0">
            <input type="hidden" class="delete-input" name="userProfile.locations[{index}].deleted" value="false"/>
            <span class="delete-button p-button p-5" template="locTemplate-{index}">Delete</span>
        </div>
    </div>
    <div class="clear"></div>
</div>
<div id="locIndex" class="template clear">${locIndex}</div>

</stripes:form>
<div style="overflow:hidden;" id="helpContainer">
  <div id="helpContent" class="helpContentContainer">
    <div style="text-align:right;padding:0px;margin:0px;margin-top:-5px;"><img src="images/delete-icon.gif" width="16" height="16" alt="Close" id="close"/></div>
    <p>
	<b>GETTING AROUND:</b> <fmt:message bundle='${help}' key='help.profile.GETTING_AROUND' />
	<b>MANDATORY FIELDS:</b> <fmt:message bundle='${help}' key='help.profile.MANDATORY_FIELDS' />
	<b>HOURS TO PERFORM:</b> <fmt:message bundle='${help}' key='help.profile.HOURS_TO_PERFORM_MENU' />
	<br><b>INITIALS:</b> <fmt:message bundle='${help}' key='help.profile.INITIALS' />
<br><b>FIRST NAME:</b> <fmt:message bundle='${help}' key='help.profile.FIRST_NAME' />
<br><b>LAST NAME:</b> <fmt:message bundle='${help}'  key='help.profile.LAST_NAME' />

<br><b>ADD PHONE:</b> <fmt:message bundle='${help}' key='help.profile.ADD_PHONE' />
<br><b>ADD EMAIL:</b> <fmt:message bundle='${help}' key='help.profile.ADD_EMAIL' />

<br><b>ADDRESS:</b> <fmt:message bundle='${help}' key='help.profile.ADDRESS' />
<br><b>ADD ADDRESS:</b> <fmt:message bundle='${help}' key='help.profile.Add_Address' />
<br><b>ADDRESS1:</b> <fmt:message bundle='${help}' key='help.profile.ADDRESS1' />
<br><b>ADDRESS2:</b> <fmt:message bundle='${help}' key='help.profile.ADDRESS2' />
<br><b>CITY:</b> <fmt:message bundle='${help}' key='help.profile.CITY' />
<br><b>STATE:</b> <fmt:message bundle='${help}' key='help.profile.STATE' />
<br><b>ZIP:</b> <fmt:message bundle='${help}' key='help.profile.ZIP' />
<br><b>TIME ZONE:</b> <fmt:message bundle='${help}' key='help.profile.TIME_ZONE' />
<br><b>EMERGENCY CONTACT:</b> <fmt:message bundle='${help}' key='help.profile.EMERGENCY_CONTACT' />
<br><b>EMERGENCY CONTACT TYPE:</b> <fmt:message bundle='${help}' key='help.profile.EMERGENCY_CONTACT_TYPE' />
<br><b>NAME:</b> <fmt:message bundle='${help}' key='help.profile.NAME' />
<br><b>PHONE:</b> <fmt:message bundle='${help}' key='help.profile.PHONE' />
<br><b>EMAIL:</b> <fmt:message bundle='${help}' key='help.profile.EMAIL' />

<br><b>CERTIFICATION</b> <fmt:message bundle='${help}' key='help.profile.CERTIFICATION' />

<br><b>LEVEL:</b> <fmt:message bundle='${help}' key='help.profile.LEVEL' />
<br><b>ISSUING BODY:</b> <fmt:message bundle='${help}' key='help.profile.ISSUING_BODY' />
<br><b>CERTIFICATE NUMBER/YEAR:</b> <fmt:message bundle='${help}' key='help.profile.CERT_NUMBER_OR_YEAR_RECEIVED' />
<br><b>EDUCATION:</b> <fmt:message bundle='${help}' key='help.profile.EDUCATION' />
<br><b>ADD:</b> <fmt:message bundle='${help}' key='help.profile.EDUCATION_ADD' />
<br><b>CAT SOFTWARE:</b> <fmt:message bundle='${help}' key='help.profile.CAT_SOFTWARE' />
<br><b>ADD:</b> <fmt:message bundle='${help}' key='help.profile.CAT_SOFTWARE_ADD' />
<br><b>COMPUTER OPERATING SYSTEM:</b> <fmt:message bundle='${help}' key='help.profile.COMPUTER_OPERATING_SYSTEM' />
<br><b>ADD:</b> <fmt:message bundle='${help}' key='help.profile.COMPUTER_OPERATING_SYSTEM_ADD' />
<br><b>JOBS PREFERRED:</b> <fmt:message bundle='${help}' key='help.profile.JOBS_PREFERRED' />
<br><b>HAVE PASSPORT:</b> <fmt:message bundle='${help}' key='help.profile.HAVE_PASSPORT' />
<br><b>TRAVEL INFORMATION:</b> <fmt:message bundle='${help}' key='help.profile.TRAVEL_INFORMATION' />
<br><b>OUT OF AREA:</b> <fmt:message bundle='${help}' key='help.profile.TRAVEL_INFORM_OUT_OF_AREA' />
<br><b>NOTE :</b> <fmt:message bundle='${help}' key='help.profile.OUT_OF_AREA_NOTE' />
<br><b>OUT OF STATE:</b> <fmt:message bundle='${help}' key='help.profile.TRAVEL_INFORM_OUT_OF_STATE'/>
<br><b>NOTE:</b> <fmt:message bundle='${help}' key='help.profile.OUT_OF_STATE_NOTE' />
<br><b>OUT OF COUNTRY:</b> <fmt:message bundle='${help}' key='help.profile.TRAVEL_INFORM_OUT_OF_COUNTRY' />
<br><b>NOTE:</b> <fmt:message bundle='${help}' key='help.profile.OUT_OF_COUNTRY_NOTE' />
<br><b>PREFERENCES:</b> <fmt:message bundle='${help}' key='help.profile.PREFERENCEC' />
<br><b>PREFERENCES NOTES:</b> <fmt:message bundle='${help}' key='help.profile.PREFERENCES_NOTES' />
<br><b>ADD:</b> <fmt:message bundle='${help}' key='help.profile.ADD_PREFERENCES' />
<br><b>EXPERTISE:</b> <fmt:message bundle='${help}' key='help.profile.EXPERTISE' />
<br><b>ADD:</b> <fmt:message bundle='${help}' key='help.profile.EXPERTISE_ADD' />
<br><b>SPECIALTIES:</b> <fmt:message bundle='${help}' key='help.profile.SPECIALTIES' />
<br><b>ADD:</b> <fmt:message bundle='${help}' key='help.profile.SPECIALTIES_ADD' />
<br><b>HOBBIES:</b> <fmt:message bundle='${help}' key='help.profile.HOBBIES' />
<br><b>ADD:</b> <fmt:message bundle='${help}' key='help.profile.HOBBIES_ADD' />
<br><b>AVAILABILITY SCHEDULE:</b> <fmt:message bundle='${help}' key='help.profile.AVAILABILITY_SCHEDULE' />
<br><b>APPLY TO MONDAY THROUGH FRIDAY:</b> <fmt:message bundle='${help}' key='help.profile.APPLY_TO_MONDAY_THROUGH_FRIDAY' />
<br><b>NOTES:</b> <fmt:message bundle='${help}' key='help.profile.NOTES' />
<br><b>PUBLIC:</b> <fmt:message bundle='${help}' key='help.profile.PUBLIC' />
<br><b>PRIVATE:</b> <fmt:message bundle='${help}' key='help.profile.PRIVATE' />
<br><b>PREVIEW:</b> <fmt:message bundle='${help}' key='help.profile.PREVIEW' />
<br><b>SAVE:</b> <fmt:message bundle='${help}' key='help.profile.SAVE' />
<br><b>CANCEL:</b> <fmt:message bundle='${help}' key='help.profile.CANCEL' />

</p>
  </div>
  <div style="float:right;color:#FFF;"><a href="#" id="slidebutton"><img src="images/helpicon.png"  alt="Help" width="36" height="94" border="0" /></a></div>
</div>

<div id='accountreceivableProfilesDialog'>
<div id='accReciContactDetailsInnerDiv'></div>
</div>

<!-- Begin InformationText -->
<div style="overflow:hidden;top:250px;height:55%;display:none;" id="infoContainer">
	<div id="infoContent" class="infoContentContainer">
		<div style="text-align:right;padding:0px;margin:0px;margin-top:-5px;">
		<img src="images/delete-icon.gif" width="16" height="16" alt="Close" id="infoclose" style="cursor:pointer;"/>
		</div>
    
		<div class="insContent" style="height: 300px;">
		<h3>Profile Mandatory Fields</h3>

		<p> <strong>First  Name, Last Name, Email = </strong>Auto-populated from registration.</p>
		<p> <strong>Initials  = </strong>Enter  your initials or shortened name.</p>
		<p> <strong>My  Hours to Perform Task = </strong>Enter the <strong>average</strong> pages per hour FOR YOU to complete scoping, proofreading  and administrative ( i.e., caption,  exhibit index, worksheet). Based on your input, QGL calculates, based on the  estimated pages of each job, the number of hours for you to scope, proof and  perform administrative tasks. The total hours to do will be lower based on  delegating to a scopist and/or proofreader. </p>
		<p>Example:  YOU scope 20 pages/hour, proof 50 pages/hour, perform administrative tasks in 1  hour.  The estimated number of pages for the  job is 200 pages.  Based upon your input  in My Hours to Perform Task, QGL will calculate 10 hours to scope, 4 hours to  proof, plus 1 hour to perform administrative tasks = 15 hours total.  (If you delegate to a scopist, your hours are  now 5 hours total to do. Additionally, if you delegate to a proofreader, your  hours are now 1 hour total to do.)</p>
	
		<h3>Profile  Informational Fields</strong></h3>
	
		<p>Click <strong>Add</strong> to  enter secondary address, email address, certifications, etc.</p>
	
		<p>Click <strong>Preview </strong>to  see what you’ve chosen as PUBLIC information.</p>
	
		<p>Click<strong> Save </strong>when  done.<strong></strong></p>
		</div>
	</div>
	
	<div style="float:right;color:#FFF;"><a href="#" id="slidebutton1"><img src="images/infoicon.png"  alt="Information" border="0" /></a>
	</div>
</div>
<!-- End InformationText -->   

<style>

.profile-left-container{margin-bottom:55px;}
/*
.profile-buttons{position:fixed;bottom:23px;left:0px;width:100%;background:#DBDBDB;}
.quiggle-footer{position:fixed;bottom:0px;left:0px;width:100%;background:#DBDBDB;margin:0px;padding:5px 10px;}*/
.public-private-switch:hover,.public-private-switch:focus,.p-button:focus,.p-button:hover{background:#FFFFCC;border-color:#5483CF;}
.profile-block:focus,.group-box:focus{border:1px solid #FFFFCC;box-shadow:0px 2px 3px #888;}

.add-button:focus,.add-button:hover,.delete-button:focus,.delete-button:hover{
background: #b3dced; /* Old browsers */
background: -moz-linear-gradient(top,  #b3dced 0%, #29b8e5 50%, #bce0ee 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b3dced), color-stop(50%,#29b8e5), color-stop(100%,#bce0ee)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #b3dced 0%,#29b8e5 50%,#bce0ee 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #b3dced 0%,#29b8e5 50%,#bce0ee 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #b3dced 0%,#29b8e5 50%,#bce0ee 100%); /* IE10+ */
background: linear-gradient(to bottom,  #b3dced 0%,#29b8e5 50%,#bce0ee 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3dced', endColorstr='#bce0ee',GradientType=0 ); /* IE6-9 */

color:#000;

}
.profile-right-container {background:#d9e4ee;color:#333;}
.profile-hours-block .input-field input, .profile-hours-block .input-field label{width:65%;}
.profile-hours-block .input-field{width:42%;margin:0px;}
.profile-hours-block span.easy, .profile-hours-block span.dense, .profile-hours-block span.regular{text-transform:uppercase;color:#555;font-size:12px;}
.profile-hours-block h2,.profile-hours-block .input-field label{color:#555;font-size:12px;}
.profile-hours-block{border-bottom:1px solid #518493;}
.profile-hours-block .input-field{padding:2px 0px;}
.profile-content label{font-size:12px;color:#555;}
.profile-right-container h1{font-size:18px;color:#555;border-bottom:1px solid #518493;}
.toolTip-cust{position:relative;height:auto;}
.toolTip-cust .toolTip-caption{
    display:none; position:absolute;
    top:-50px; left:0px; width:auto;
	font:10px;
   background: rgb(254,252,234); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(238,246,253,1) 0%,rgba(226,242,255,1) 100%);/* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(254,252,234,1)), color-stop(100%,rgba(241,218,54,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(238,246,253,1) 0%,rgba(226,242,255,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(238,246,253,1) 0%,rgba(226,242,255,1) 100%); /* W3C */ /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(238,246,253,1) 0%,rgba(226,242,255,1) 100%); /* W3C */ /* IE10+ */
background: linear-gradient(to bottom,  rgba(238,246,253,1) 0%,rgba(226,242,255,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eef6fd', endColorstr='#e2f1ff',GradientType=0 ); /* IE6-9 */

    color: #000;
    text-shadow: 0 1px 0 #fff;
	padding:5px;
	border-radius:5px;
	text-align:center;
	border:1px solid #578EB8;
	z-index:99999999999;
	min-height:32px;
    
}
.toolTip-cust .toolTip-caption:after{content:"";border:5px solid transparent;border-top:5px solid #578EB8;top:100%;position:absolute;left:45%;}

.toolTip-cust:focus .toolTip-caption,.toolTip-cust:hover .toolTip-caption{display:block;
   }
   
.profile-block table tr:first-child td:first-child .toolTip-cust .toolTip-caption{top:-172px;}
.profile-block table tr:first-child td:nth-child(3) .toolTip-cust .toolTip-caption{top:-204px;}
.profile-buttons .toolTip-cust .toolTip-caption{width:8em;height:75px;left:-88px;top:-73px;}

.ketchup-errorPar{position:relative; float:left;}
.ketchup-errorPar .ketchup-error{position:absolute;left:75px;
    top: -45px;
    width: 100px;}
.ketchup-errorPar .ketchup-error ul{padding:3px;font-size:11px;text-align:center;}

.profile-hours-container .ketchup-error{width:74px;top:-34px;left:-15px;}
.profile-hours-container  .ketchup-error ul{padding:3px;font-size:11px;}

.profile-block .f-l {position:relative;}
.skillAdminHrs .ketchup-error{left:25px;}
.emergencycontact .ketchup-errorPar .ketchup-error{position:absolute;left:75px;
    top: -32px;
    width: 100px;}
	.emergencycontact .errphonemsg .ketchup-errorPar .ketchup-error{position:absolute;left:75px;
    top: -45px;
    width: 100px;}
.radioclass{padding:3px;}
.radiofocusclass{background:#fffff0;}
.dashboard-content {
    background: #F9F9F9;
    /*margin: 1px 5px 5px 5px;*/
    border-radius: 5px;
    padding: 15px;
    font-size: 12px;
	display: table;
	min-height:0px;

}

.ui-dialog .ui-dialog-buttonpane button {
    cursor: pointer;
    margin-bottom: 0.5em;
    margin-left: 0;
    margin-right: 0.4em;
    margin-top: 0.5em;
	height:35px;
}
.profile-content {position:relative;}
.profile-content .top-row-buttons{width:420px;position:absolute;right:0px;}
.public-private-switch .toolTip-caption{top:-65px;width:180px;}
.ui-dialog .ui-dialog-buttonpane button:focus {
background: #b3dced; /* Old browsers */
background: -moz-linear-gradient(top,  #b3dced 0%, #29b8e5 50%, #bce0ee 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b3dced), color-stop(50%,#29b8e5), color-stop(100%,#bce0ee)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #b3dced 0%,#29b8e5 50%,#bce0ee 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #b3dced 0%,#29b8e5 50%,#bce0ee 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #b3dced 0%,#29b8e5 50%,#bce0ee 100%); /* IE10+ */
background: linear-gradient(to bottom,  #b3dced 0%,#29b8e5 50%,#bce0ee 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3dced', endColorstr='#bce0ee',GradientType=0 ); /* IE6-9 */

color:#000;

}
.profile-left-container input:hover,.profile-left-container input:focus,.profile-hours-container input:hover,.profile-hours-container input:focus
{
background:#FFFFCC;border-color:#5483cf;
}
table select {
    width: 200px;
}
#accReciContactDetailsInnerDiv span input{font-size:12px;}
.contactEmailwidth{width:200px;}

.emailErrorDiv{
	background:#FFE4DD;
    border: 1px solid #FFE4DD;
    color: #571D0E;
    font-size: 12px;
    margin: 3px 0 15px;
    padding: 4px 10px;
	}

#helpContainer{width:0px;}
</style>

